<template>
  <div class="mouldForm fromCom" id="fromCom">
    <el-form
      :model="formData"
      :label-width="lableWidth"
      class="demo-ruleForm"
      ref="ruleForm"
      label-position="left"
    >
      <el-col
        v-for="(formobj, index) in formObj"
        v-show="!formobj.notShow"
        :key="index"
        :span="formobj.width ? formobj.width : 24"
      >
        <el-form-item
          v-if="formobj.label || formobj.btn"
          :prop="formobj.prop"
          :rules="formobj.rules"
        >
          <el-input
            :class="'bgwarn' + formData[formobj.bgwarn]"
            v-if="formobj.input"
            v-model="formData[formobj.prop]"
            size="small"
            :disabled="formobj.disabled"
            :placeholder="formobj.placeholder"
            @input="inputINPUT($event, index, formobj.prop)"
            @change="inputChange($event, index, formobj.prop)"
            @focus="inputFocus(index, formobj.prop)"
            @blur="inputBlur($event, index, formobj.prop)"
          />

          <div v-if="formobj.inputBtn" style="display: flex; width: 98.2%">
            <el-input
              :class="'bgwarn' + formData[formobj.bgwarn]"
              v-if="formobj.inputBtn"
              v-model="formData[formobj.prop]"
              size="small"
              :disabled="formobj.disabled"
              :placeholder="formobj.placeholder"
              @input="inputINPUT($event, index, formobj.prop)"
              @change="inputChange($event, index, formobj.prop)"
              @focus="inputFocus(index, formobj.prop)"
              @blur="inputBlur($event, index, formobj.prop)"
            />

            <el-button
              type="primary"
              v-if="formobj.inputButton"
              icon="el-icon-search"
              size="small"
              @click="clickDialog(index, formobj.prop)"
              style="margin: 8px 0 2px 3px"
              >选择</el-button
            >
          </div>

          <el-input
            :class="'bgwarn' + formData[formobj.bgwarn]"
            v-if="formobj.inputNumber"
            v-model="formData[formobj.prop]"
            size="small"
            :disabled="formobj.disabled"
            :placeholder="formobj.placeholder"
            type="number"
            @input="inputINPUT($event, index, formobj.prop)"
            @change="inputChange($event, index, formobj.prop)"
          />
          <!-- textarea输入框 :rows="formObj.rows"-->
          <el-input
            v-if="formobj.textarea"
            v-model="formData[formobj.prop]"
            size="small"
            type="textarea"
            autosize
            :disabled="formobj.disabled"
            :placeholder="formobj.placeholder"
          />
          <!-- select选择器 -->
          <el-select
            v-if="formobj.select"
            v-model="formData[formobj.prop]"
            size="small"
            :disabled="formobj.disabled"
            :placeholder="formobj.placeholder"
            @change="yj_searchForm($event, index, formobj.prop)"
          >
            <el-option
              v-for="(options, sIndex) in formobj.options"
              :key="sIndex"
              :label="options.label"
              :value="options.value"
            />
          </el-select>
          <!-- 树结构 -->
          <el-select
            v-if="formobj.selectsTree"
            v-model="formData[formobj.prop]"
            size="small"
            :disabled="formobj.disabled"
            :placeholder="formobj.placeholder"
            @change="selectChange($event, index, formobj.prop)"
          >
            <el-option style="height: auto; padding: 0" value="">
              <tree
                class="selectTree"
                :treeData="formobj.tree.treeData"
                :checkData="formobj.tree.checkData"
                :nodeKey="formobj.tree.id"
                @getTreeInfo="handleNodeClick"
                :defaultProps="formobj.tree.defaultProps"
              >
              </tree>
            </el-option>
          </el-select>

          <el-date-picker
            type="year"
            value-format="yyyy"
            @change="yj_searchForm($event, index, formobj.prop)"
            v-if="formobj.year"
            v-model="formData[formobj.prop]"
            :disabled="formobj.disabled"
            :placeholder="formobj.placeholder"
          >
          </el-date-picker>
          <el-select
            v-if="formobj.selects"
            v-model="formData[formobj.prop]"
            size="small"
            :disabled="formobj.disabled"
            :placeholder="formobj.placeholder"
            @change="yj_searchForm($event, index, formobj.prop)"
          >
            <el-option
              v-for="(options, sIndex) in formobj.options"
              :key="sIndex"
              :label="options.label"
              :value="options.label"
            />
          </el-select>
          <el-select
            v-if="formobj.xm"
            v-model="formData[formobj.prop]"
            size="small"
            :disabled="formobj.disabled"
            :placeholder="formobj.placeholder"
            @change="selectProject($event, index, formobj.prop)"
          >
            <el-option
              v-for="(options, sIndex) in projectsObj"
              :key="sIndex"
              :label="options.fItemName"
              :value="options.fItemValue"
            />
          </el-select>
          <el-select
            v-if="formobj.bd"
            v-model="formData[formobj.prop]"
            size="small"
            :disabled="formobj.disabled"
            :placeholder="formobj.placeholder"
          >
            <el-option
              v-for="(options, sIndex) in tendersObj"
              :key="sIndex"
              :label="options.fItemName"
              :value="options.fItemValue"
            />
          </el-select>
          <!-- 多选 -->
          <el-select
            v-if="formobj.manySelect"
            v-model="formData[formobj.prop]"
            size="small"
            multiple
            :disabled="formobj.disabled"
            :placeholder="formobj.placeholder"
            @change="selectChange($event, index, formobj.prop)"
          >
            <el-option
              v-for="(options, sIndex) in formobj.options"
              :key="sIndex"
              :label="options.label"
              :value="options"
            />
          </el-select>
          <!-- select搜索框 -->
          <el-select
            v-if="formobj.searchSelect"
            v-model="formData[formobj.prop]"
            size="small"
            :disabled="formobj.disabled"
            filterable
            remote
            reserve-keyword
            :placeholder="formobj.placeholder"
            :remote-method="(query) => remoteMethod(query, index, formobj.prop)"
            :loading="searchSelectLoading"
            @change="selectChange($event, index, formobj.prop)"
          >
            <el-option
              v-for="(item, ssIndex) in formobj.options"
              :key="ssIndex"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
          <el-date-picker
            v-if="formobj.year"
            v-model="formData[formobj.prop]"
            type="year"
            :disabled="formobj.disabled"
            :placeholder="formobj.placeholder"
          >
          </el-date-picker>
          <!-- 年月日时分秒选择器 -->
          <el-date-picker
            v-if="formobj.dateTime"
            v-model="formData[formobj.prop]"
            value-format="yyyy-MM-dd HH:mm:ss"
            type="datetime"
            popper-class="yjxa_dateTimepicker"
            size="small"
            :disabled="formobj.disabled"
            :placeholder="formobj.placeholder"
          />
          <!-- 年月日时分秒，开始和结束时间 -->
          <el-date-picker
            v-if="formobj.dateTimeRange"
            v-model="formData[formobj.prop]"
            dateTimeRanges
            value-format="yyyy-MM-dd HH:mm:ss"
            format="yyyy-MM-dd HH:mm:ss"
            size="small"
            type="datetimerange"
            :disabled="formobj.disabled"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
          />
          <!--  -->
          <el-date-picker
            v-if="formobj.dateTimeRanges"
            v-model="formData[formobj.prop]"
            @change="selectChange($event, index, formobj.prop)"
            value-format="yyyy-MM-dd"
            format="yyyy-MM-dd"
            size="small"
            type="datetimerange"
            :disabled="formobj.disabled"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
          />
          <!-- 时分秒选择器 -->
          <el-time-picker
            v-if="formobj.timePicker"
            v-model="formData[formobj.prop]"
            value-format="HH:mm:ss"
            format="HH:mm:ss"
            size="small"
            :disabled="formobj.disabled"
            :placeholder="formobj.placeholder"
            :picker-options="formobj.options"
          />
          <!-- 时分秒选择器，开始和结束时间 -->
          <el-time-picker
            v-if="formobj.timePickerIsRange"
            v-model="formData[formobj.prop]"
            value-format="HH:mm:ss"
            format="HH:mm:ss"
            is-range
            size="small"
            :disabled="formobj.disabled"
            range-separator="至"
            start-placeholder="开始时间"
            end-placeholder="结束时间"
            placeholder="选择时间范围"
          />
          <el-date-picker
            :picker-options="pickerOption"
            @change="selectChange($event, index, formobj.prop)"
            v-if="formobj.datePicker1"
            v-model="formData[formobj.prop]"
            value-format="yyyy-MM-dd"
            size="small"
            :disabled="formobj.disabled"
            :placeholder="formobj.placeholder"
          />
          <el-date-picker
            :picker-options="pickerOptions"
            @change="selectChange($event, index, formobj.prop)"
            v-if="formobj.datePicker2"
            v-model="formData[formobj.prop]"
            value-format="yyyy-MM-dd"
            size="small"
            :disabled="formobj.disabled"
            :placeholder="formobj.placeholder"
          />
          <div
            v-if="formobj.btn"
            class="searchBtn"
            style="
              text-align: right;
              display: flex;
              align-items: center;
              height: 43px;
            "
          >
            <el-button type="primary" @click="yj_searchForm()">查询</el-button>
            <!-- <el-button @click="reset">重置</el-button> -->
          </div>
          <!-- 年月日选择器 -->
          <el-date-picker
            v-if="formobj.datePicker"
            v-model="formData[formobj.prop]"
            value-format="yyyy-MM-dd"
            size="small"
            :disabled="formobj.disabled"
            :placeholder="formobj.placeholder"
          />
          <!-- 年月日选择器，开始和介绍年月日 -->
          <el-date-picker
            v-if="formobj.datePickerIsRange"
            v-model="formData[formobj.prop]"
            value-format="yyyy-MM-dd"
            type="daterange"
            size="small"
            :picker-options="pickerOptions"
            @change="selectChange($event, index, formobj.prop)"
            :disabled="formobj.disabled"
            :placeholder="formobj.placeholder"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
          />
          <!-- switch开关 -->
          <el-switch
            v-if="formobj.switch"
            v-model="formData[formobj.prop]"
            size="small"
            :disabled="formobj.disabled"
            @change="formSwitchChange($event, index, formobj.prop)"
          />
          <!-- radio单选框 -->
          <el-radio-group
            @input="changeRadio"
            v-if="formobj.radio"
            v-model="formData[formobj.prop]"
            :disabled="formobj.disabled"
          >
            <!-- <el-radio v-for="(options, rIndex) in formobj.options" :key="rIndex" :label="options.label"
                              :value="options.value" /> -->
            <el-radio
              v-for="(options, rIndex) in formobj.options"
              :key="rIndex"
              :label="options.value"
              >{{ options.label }}</el-radio
            >
          </el-radio-group>
          <!-- checkbox复选框 -->
          <el-checkbox-group
            v-if="formobj.checkbox"
            v-model="formData[formobj.prop]"
            :disabled="formobj.disabled"
          >
            <el-checkbox
              v-for="options in formobj.options"
              :key="options.value"
              :label="options.label"
            />
          </el-checkbox-group>
          <!-- 文件上传 -->
          <!-- 如果对象有值就回显，没有值就为空 -->
          <!-- 按钮 -->
          <el-button
            v-if="formobj.button"
            size="small"
            :disabled="formobj.disabled"
            :loading="formobj.loading"
            :type="formobj.buttonType || 'primary'"
            @click="buttonClick(formobj.prop, index)"
          >
            {{ formobj.placeholder }}
          </el-button>
          <!-- text展示 -->

          <span v-if="formobj.text" v-text="formData[formobj.prop]" />
          <!-- 计量单位 -->
          <span v-if="formobj.unit" class="left10">{{ formobj.unit }}</span>
          <div
            v-if="formobj.upload"
            style="
              display: flex;
              width: 100%;
              justify-content: space-between;
              align-items: center;
            "
          >
            <el-input v-if="false" autocomplete="off"> </el-input>
            <div
              class="fy_fileboxdis"
              style="
                height: 40px;
                line-height: 40px;
                width: 100%;
                display: flex;
                border: 1px solid #e4e7ed;
                border-radius: 5px;
              "
            >
              <div
                v-for="(v, i) in fileLists"
                :key="i"
                style="margin: 2px 3px; height: 87%"
                @click="openPdfs(v)"
              >
                <img
                  style="max-width: 100%; max-height: 100%"
                  src="@/assets/img/pdf.png"
                />
              </div>
            </div>
            <el-button
              type="primary"
              v-if="formobj.uploadSelect"
              icon="el-icon-search"
              size="small"
              @click="clickUpload"
              style="
                width: 66px;
                height: 32px;
                text-align: center;
                margin-left: 8px;
              "
              >操作</el-button
            >
            <uploads
              :dialogUpload="dialogUpload"
              @closes="closeDialog"
              fileType="1"
              :folderid="timestamp"
              @upFileList="getFile"
              :fileArray="fileLists"
              @delteFile="delteFile"
            >
            </uploads>
            <pdfDialog
              :dialogVisible="dialogVisibles"
              @closes="dialogVisibles = false"
              :fileDetail="fileDetail"
            >
            </pdfDialog>
          </div>
          <!-- 适用于工作指令执行报告   左边内容过长使用 -->
          <div v-if="formobj.upload1" style="display: flex; width: 80.2%">
            <el-input v-if="false" autocomplete="off"> </el-input>
            <div
              style="
                height: 25px;
                line-height: 25px;
                width: 100%;
                display: flex;
                border: 1px solid #d1d7e2;
                border-radius: 5px;
                margin: 8px 0 2px 0;
              "
            >
              <div
                v-for="(v, i) in fileLists"
                :key="i"
                style="margin: 2px 3px; height: 87%"
                @click="openPdfs(v)"
              >
                <img
                  style="max-width: 100%; max-height: 100%"
                  src="@/assets/img/pdf.png"
                />
              </div>
            </div>
            <el-button
              type="primary"
              v-if="formobj.uploadSelect"
              icon="el-icon-search"
              size="small"
              @click="clickUpload"
              style="margin: 8px 0 2px 3px"
              >操作</el-button
            >
            <uploads
              :dialogUpload="dialogUpload"
              @closes="closeDialog"
              fileType="1"
              :folderid="timestamp"
              @upFileList="getFile"
              :fileArray="fileLists"
              @delteFile="delteFile"
            >
            </uploads>
            <pdfDialog
              :dialogVisible="dialogVisibles"
              @closes="dialogVisibles = false"
              :fileDetail="fileDetail"
            >
            </pdfDialog>
          </div>
          <!-- 适用于工作指令执行报告   左边内容过长使用 -->
        </el-form-item>

        <div v-if="formobj.labels">
          <img
            style="vertical-align: middle"
            src="@/assets/img/Supervision/com_flg.png"
            alt=""
          />
          <span style="margin-left: 8px">{{ formobj.labels }}</span>
        </div>
      </el-col>

      <!-- <el-col v-for="(formobj, index) in formObj" :key="index" :span="formobj.width ? formobj.width : 24"
                class="searchBtn" style="text-align: right; display: flex; justify-content: end">
                
            </el-col> -->
    </el-form>
  </div>
</template>
ng封装,date:20210429,详细使用见根目录@/views/home/testForm/testForm.vue,————————————————————————————————————————————————————————————————————————————————
-->
<script>
import uploads from "@/components/public/el-upload.vue";
import pdfDialog from "@/components/public/pdf-dialog";
import tree from "@/components/TensionAndGrout/tree";

import { upload } from "@/api/request.js";
// import actions from "@/actions";

// import aMap from '../../map/aMap.vue'
// import quillEditor from '@/components/quillEditor/quillEditor.vue'
export default {
  components: {
    // quillEditor
    uploads,
    pdfDialog,
    tree,
  },
  props: {
    formObj: {
      type: Array,
      required: true,
    },
    lableWidth: {
      type: String,
      default: "1px",
    },
    // projectsObj: {
    //     type: Array,
    //     default: () => {
    //         return [];
    //     },
    // },
    formData: {
      type: Object,
      required: true,
    },
    searchSelectOptionsCb: {
      type: Array,
    },
    timestamp: {
      type: String,
    },
    fileList: {
      type: Array,
      default: () => {
        return [];
      },
    },
    messAgeNum: {
      type: Number,
      default: 0,
    },
  },

  data() {
    // let uploadFileUrl = this.$store.state.user.uploadFileUrl;
    return {
      pickerOptions: {
        //主页面日期筛选 带快捷选项
        disabledDate(time) {
          return time.getTime() > Date.now();
          // return time.getTime() > Date.now();  // 可选历史天、可选当前天、不可选未来天
          // return time.getTime() > Date.now() - 8.64e7;  // 可选历史天、不可选当前天、不可选未来天
          // return time.getTime() < Date.now() - 8.64e7;  // 不可选历史天、可选当前天、可选未来天
          // return time.getTime() < Date.now(); // 不可选历史天、不可选当前天、可选未来天
        },
        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              // console.log(start);
              start.setTime(start.getTime());
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "昨天",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              // console.log(start);
              start.setTime(start.getTime() - 3600 * 1000 * 24);
              end.setTime(end.getTime() - 3600 * 1000 * 24);

              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近三个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近一年",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 365);
              picker.$emit("pick", [start, end]);
            },
          },
        ],
      },
      activeName: "1",
      // uploadUrl: uploadFileUrl,
      dialogImageUrl: "",
      searchSelectLoading: false,
      dialogVisible: false,
      disabled: false,
      searchShow: "", //高德地图input收索联想
      setSearchVal: [], //高德地图赋值搜索内容
      userInfo: {},
      enclosureImg: {},
      fSourcefileList: [],

      dialogUpload: false,
      dialogUpload1: false,
      dialog: false, //弹出框
      fileLists: [],
      dialogVisibles: false,
      fileDetail: null,
      projectsObj: [],
      tendersObj: [],
      formDatas: {},
      pickerOption: {
        disabledDate(time) {
          return time.getTime() > Date.now();

          // return '2023/05/07' || time.getTime() > Date.now();
        },
      },
    };
  },

  created() {
    this.userInfo = JSON.parse(sessionStorage.getItem("GxBack-userInfo"));
  },
  // computed: {
  //     'formData.fWarninglevel': {
  //         get: function () {
  //             return this.formData.fWarninglevel == 1 ? '男' : this.formData.fWarninglevel == 0 ? '女' : '未知'
  //         },
  //         set: function (value) {
  //             this.formData.fWarninglevel = value === '男' ? 1 : 0
  //         }
  //     }
  // },
  watch: {
    "formData.fWarninglevel": {
      handler(newVal) {
        if (newVal == 0) {
          this.formData.fWarninglevel = "正常";
        } else if (newVal == 1) {
          this.formData.fWarninglevel = "一级";
        } else if (newVal == 2) {
          this.formData.fWarninglevel = "二级";
        } else if (newVal == 3) {
          this.formData.fWarninglevel = "三级";
        } else if (newVal == 4) {
          this.formData.fWarninglevel = "四级";
        } else if (newVal == 5) {
          this.formData.fWarninglevel = "五级";
        }
      },
      immediate: true,
      deep: true, // 可以深度检测到 person 对象的属性值的变化
    },
    fileList: {
      handler(newVal) {
        if (newVal) {
          this.fileLists = this.fileList;
        }
      },
      immediate: true,
    },
    formData: {
      handler(newVal) {
        if (newVal) {
          this.formDatas = newVal;
         
        }
      },
      immediate: true,
    },
  },
  mounted() {
    // actions.onGlobalStateChange((state, prev) => {
    //     var data = prev.currentUser.projects
    //     this.projectsObj = [
    //         {
    //             fItemName: "所有项目",
    //             fItemValue: "",
    //         },
    //     ];
    //     data.map((item) => {
    //         this.projectsObj.push({
    //             fItemName: item.projectName,
    //             fItemValue: item.projectId,
    //         });
    //     });
    //     this.formData.fprojectid = this.projectsObj[1].fItemValue
    //     this.getTender(this.projectsObj[1].fItemValue)
    //     console.log(444, this.projectsObj);
    // }, true);
  },
  methods: {
    reset() {
      this.$emit("reset", this.projectsObj[1].fItemValue);
    },
    yj_searchForm() {
      this.formData.page=1
      this.$emit("yj_searchForm", this.formData);
    },
    selectProject(e) {
      this.getTender(e);
    },

    async getTender(e) {
      await this.$http(
        "http://1.14.103.201:8300/IOTManagement/Base/Company/getGXBaseCompanyList.do?projectId=" +
          e
      ).then((res) => {
        if (res.status == 200) {
          var data = res.data.data.GXCompanyList;
          this.tendersObj = [
            {
              fItemName: "所有标段",
              fItemValue: "",
            },
          ];
          data.map((item) => {
            this.tendersObj.push({
              fItemName: item.sectionName,
              fItemValue: item.sectionId,
            });
          });
        }
      });
    },

    collapseChange(val) {
      return val;
    },
    // 照片文件
    closeDialog() {
      this.dialogUpload = false;
    },
    getFile(val) {
      this.fileLists = val;
      return val;
    },
    clickUpload() {
      this.dialogUpload = true;
    },
    clickDialog(index, prop) {
      this.$emit("clickDialog", index, prop);
    },

    clickUpload1() {
      this.dialogUpload1 = true;
    },
    openPdfs(v) {
      this.dialogVisibles = true;
      this.fileDetail = v;
    },
    // 文件删除
    delteFile(file) {
      this.$emit("delteFile", file);
    },
    // 照片文件

    //select变化调用
    selectChange(value, index, prop) {
      this.$forceUpdate(); //强制刷新视图

      this.$emit("selectChange", value, index, prop);
    },
    // input的input事件
    inputINPUT(value, index, prop) {
      this.$emit("inputINPUT", value, index, prop);
    },
    // input的change事件
    inputChange(value, index, prop) {
      this.$emit("inputChange", value, index, prop);
    },
    inputFocus(index, prop) {
      this.$emit("inputFocus", index, prop);
    },
    inputBlur(value, index, prop) {
      this.$emit("inputBlur", value, index, prop);
    },
    // 搜索类型select搜索
    remoteMethod(query, index, prop) {
      if (query) {
        this.searchSelectLoading = true;
        this.$emit("querySelectValue", query, index, prop);
        setTimeout(() => {
          this.formObj[index].options = this.searchSelectOptionsCb;
          this.searchSelectLoading = false;
        }, 500);
      } else {
        this.searchSelectOptios = [];
      }
    },
    //switch变化
    formSwitchChange(val, index, prop) {
      this.$emit("formSwitchChange", val, index, prop);
    },
    //按钮点击事件
    buttonClick(prop, index) {
      this.$emit("buttonClick", prop, index);
    },
    changeRadio(val) {
      this.$emit("changeRadio", val);
    },
    // 上传照片
    handleChange(res) {
      // fHandlefile
      this.enclosureImg = new FormData(); //new一个formData事件
      this.enclosureImg.append("file", res.raw); //将file属性添加到formData里
      this.enclosureImg.append("folderid", this.timestamp); //将file属性添加到formData里
      this.enclosureImg.append("userId", this.userInfo.userId); //将file属性添加到formData里
      this.enclosureImg.append("userName", this.userInfo.realName); //将file属性添加到formData里

      upload(this.enclosureImg).then((i) => {
        i[0]["name"] = res.name;
        i[0]["url"] = res.url;

        this.fSourcefileList.push(i[0]);
      });
    },
    //文件上传成功回调
    uploadSuccess(response, file, fileList, limit, prop, index) {
      this.formObj[index].uploadObj.hideUpload = fileList.length == limit; //文件列表变化后判断当前文件列表长度是否等于限制长度。目的，当长度相等时隐藏文件上传按钮
      this.pushUpload(file, fileList, limit, prop);
      return response, file, fileList, limit, prop, index;
    },
    //文件删除
    handleRemove(file, fileList, limit, prop, index) {
      this.formObj[index].uploadObj.hideUpload = fileList.length == limit; //文件删除后判断当前文件列表长度是否等于限制长度。目的，当长度相等时隐藏文件上传按钮
      this.pushUpload(file, fileList, limit, prop);
    },
    // 文件预览
    handlePictureCardPreview(file) {
      this.dialogImageUrl = file.url;
      this.dialogVisible = true;
    },

    //提交时验证表单，直接在父级调用
    submitForm() {
      let formValidate = Boolean;
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
          formValidate = true;
        } else {
          if (this.messAgeNum == 0) {
            this.$message.warning("请把信息填写完整！");
          }

          formValidate = false;
        }
      });
      return formValidate;
    },
    /* 清空表单
                逻辑：
                1 、如果要清空文件上传列表，要传入要清空的upload的字段名，假如多个upload用for循环，调用清空方法！
                2、清空upload之后，还要把upload上传框展示出来，通过字段名比对，获取到在formObj中的下标，通过下标操作对象属性，进行展示
             */
    resetForm(uploadArr) {
      this.$refs.ruleForm.resetFields();
      if (uploadArr) {
        for (let i = 0; i < uploadArr.length; i++) {
          this.$refs[uploadArr[i]][0].clearFiles();
          let index = this.formObj.findIndex(
            (item) => item.prop == uploadArr[i]
          );
          this.formObj[index].uploadObj.hideUpload = false;
        }
      }
    },
    // 单个字段验证
    validateFieldProp(prop) {
      let formValidate = Boolean;
      this.$refs.ruleForm.validateField(prop, (valid) => {
        if (!valid) {
          formValidate = true;
        } else {
          formValidate = false;
        }
      });
      return formValidate;
    },
    // 对文件上传，删除进行赋值，调用form验证
    pushUpload(file, fileList, limit, prop) {
      if (fileList.length > 0) {
        this.formData[prop] = fileList;
      } else {
        // 表示没有数据,把字段置空
        this.formData[prop] = "";
      }
      this.$refs.ruleForm.validateField(prop); //调用验证form表单的文件上传
    },
    //地图input的input事件
    aMapInput(value, prop) {
      this.$refs[`aMap${prop}`][0].getSearch(value);
    },
    //子组件返回地图搜索值
    cbSearch(val, prop) {
      this.setSearchVal = val.tips; //子组件
      this.searchShow = prop; //显示input输入联想
    },
    //选中地图值
    selectVal(val, prop, index) {
      // 赋值的时候，拿到键，及formobj的下标，进行赋值
      this.formData[prop] = val.name; //input输入框赋值
      this.formData.district = val.district; //传入省市区
      let lngLat = {
        lng: val.location.lng,
        lat: val.location.lat,
      };
      this.formData[`${prop}location`] = lngLat;
      this.searchShow = ""; //隐藏input输入联想
      return index;
    },
    // 点击左侧机构树
    handleNodeClick(data) {
      this.$emit("handleNodeClick", data);
    },
  },
};
</script>

<style lang="less" scoped>
@width: 220px;

form {
  // overflow: hidden;
  display: flex;
  flex-wrap: wrap;
}
.fromCom {
  width: 100%;
}
.fromCom /deep/.el-form-item__content {
  margin-left: 0px !important;
}
.fromCom /deep/.el-select {
}
/deep/.el-input {
  // width: @width;
  width: 100%;
  height: 40px;
  line-height: 40px;
}
/deep/.el-select {
  // width: @width;
  width: 100%;
  height: 40px;
  line-height: 40px;
}

/deep/.el-input__inner,
/deep/.el-input--small {
  height: 40px;
  line-height: 40px;
}

// div[data-qiankun="zdgy"] .yjxa-input--small .yjxa-input__inner {
//     height: 32px;
//     line-height: 32px;
// }
/deep/.el-date-editor.el-input {
  width: @width;
}

/deep/.el-date-editor .el-range-separator {
  width: 20px !important;
}

/deep/.el-range-editor--small.el-input__inner {
  width: 400px;
}

.el-textarea {
  width: 400px;
}

.hide {
  /deep/ .el-upload--picture-card {
    display: none;
  }
}

.amap_div {
  overflow: hidden;
  height: 400px;
  width: 600px;
  position: relative;

  .sreach_ul {
    position: absolute;
    top: 1;
    background-color: white;
    z-index: 9;
    min-width: 210px;
    float: auto;
    height: 200px;
    overflow: auto;
    padding: 0 20px;
    line-height: 24px;
  }
}

.mouldForm {
  height: 100%;
  width: 100%;
}

.upuupu {
  border: 1px solid red !important;
}

#fromCom /deep/.el-date-editor {
  min-width: 100% !important;
}

#fromCom /deep/.el-input__prefix {
  line-height: 25px;
  height: 25px;
}

#fromCom /deep/.el-input__icon {
  line-height: 25px;
  height: 25px;
}
#fromCom /deep/.el-select {
  margin-right: 0px !important;
}
.selectTree {
  overflow-y: hidden !important;
}
</style>
